<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>处理表</title>
  <link rel="stylesheet" href="../../layui/css/layui.css">
  <script src="../../layui/layui.js"></script>
</head>
<body>
<div class="site-text" style="margin: 5%; display: none" id="check"  target="test123">
  <form class="layui-form" lay-filter="FormLoad" id="event">
    <table border='1px' width='100%' cellpadding='0' id="used">
    </table>
    <div class="layui-form-item" id="suggestion" style="display: none">
      <label class="layui-form-label">处理意见</label>
      <div class="layui-input-block">
        <textarea id="handle_suggestion" name="handle_suggestion" style="height: 80px" required lay-verify="required" class="layui-textarea"></textarea>
      </div>
    </div>
    <div class="layui-form-item" id="button" style="display: none">
      <div class="layui-input-block">
        <button class="layui-btn" lay-submit lay-filter="handle">提交</button>
        <button class="layui-btn" lay-submit lay-filter="not">取消</button>
      </div>
    </div>
  </form>
</div>

<div class="layui-inline" style="float:right;margin-right: 100px;">
  <div class="layui-input-block" >
    <button class="layui-btn"   id="exit" >退出</button>
  </div>
</div>
<form class="layui-form" style="margin: 20px;text-align:center ">
  <div class="layui-form-item" style="">
    <div class="layui-inline" style="margin-top: 10px">
      <div class="layui-input-block" >
        <button class="layui-btn" lay-submit lay-filter="*">查询</button>
      </div>
    </div>
    <div class="layui-inline" style="margin-top: 10px; display: none">
      <label class="layui-form-label">状态查询： </label>
      <div class="layui-input-inline">
        <select name="modules" id="test" lay-filter="test" lay-search="" lay-verify="">
          <option value="0" selected>无</option>
          <option value="1">草稿</option>
          <option value="2">已提交</option>
          <option value="3">已受理</option>
          <option value="4">已审核</option>
        </select>
      </div>
    </div>
    <div class="layui-inline" style="margin-top: 10px">
      <label class="layui-form-label">事件种类： </label>
      <div class="layui-input-inline" >
        <select name="modules" id="test0" lay-filter="test0" lay-search="" lay-verify="">
          <option value="0" selected>无</option>
          <option value="1">行政后勤不良事件</option>
          <option value="2">治安不良事件</option>
          <option value="3">用药错误不良事件</option>
          <option value="4">用药临界差错事件</option>
          <option value="5">药物不良反应事件</option>
          <option value="6">医疗器械不良事件</option>
          <option value="7">输血不良反应事件</option>
          <option value="8">医院感染病例</option>
          <option value="9">化妆品不良事件</option>
          <option value="10">职业暴露登记表</option>
          <option value="11">护理不良事件</option>
        </select>
      </div>
    </div>
  </div>
</form>
<table id="demo" lay-filter="test"></table>
<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="select">查看</a>
  <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="handle">处理</a>
</script>

<script type="text/html" id="index">
  {{d.LAY_TABLE_INDEX+1}}
</script>
</body>
<script>

  layui.use(['table','form','jquery','layer'], function(){
    let table = layui.table;
    let form = layui.form;
    let $ = layui.$;
    let layer = layui.layer;
    let router = layui.router();

    let dept_name = localStorage.getItem("dept_name");

    //表格渲染
    table.render({
      elem: '#demo'
      ,height: 666
      ,url: '/Zz/handle_event?'+'dept_name='+dept_name //数据接口
      ,page: true //开启分页
      ,cols: [[ //表头
        {title: '序号', fixed: 'left', fixed: 'left', templet: '#index'}
        ,{field: 'reporter_code', title: '提交人' }
        ,{field: 'event_time', title: '提交时间' }
        ,{field: 'kind_name', title: '事件种类'}
        ,{field: 'status_name', title: '事件状态'}
        ,{fixed: 'right', title:'操作', align:'center', toolbar: '#barDemo'}
      ]],
    });
    //监听工具条
    table.on('tool(test)', function(obj){
      let layEvent = obj.event;
      if(layEvent === 'select'){
        //弹出层
        let button = document.getElementById("button");
        button.style.display = "none";
        let suggestion = document.getElementById("suggestion");
        suggestion.style.display = "none";
        layer.closeAll();
        layer.open({
          type: 1 //Page层类型
          ,skin: 'layui-layer-molv'
          ,area: ['1000px', '800px']
          ,title: ['查看不良事件','font-size:18px']
          ,shadeClose: true
          ,shade: 0 //遮罩透明度
          ,maxmin: true //允许全屏最小化
          ,content:$("#check")  //弹窗路径
          ,success:function(){
            $.ajax({
              url:"/look?"+'form_code='+obj.data.form_code,
              type: 'get',
              success:function(data){
                // console.log(data);
                let jsonObj = eval('(' + data + ')'); //获得jsonObj对象
                console.log(jsonObj);
                for (let i=0; i < jsonObj.data.length; i++) {
                  $("#used").append("<tr><div class='layui-form-item'><td width='200px'>" + jsonObj.data[i].property_name + "</td><td colspan='5'><input type='text' disabled  placeholder= '' class='layui-input' name='"+jsonObj.data[i].property_en_name+"' value=' " + jsonObj.data[i].detailed_data + "'/></td></div></tr>");

                }
              }
            });
          }

        });
        $("#used").empty();
      } else if(layEvent === 'handle') {
        //弹出层
        let button = document.getElementById("button");
        button.style.display = "inline";
        let suggestion = document.getElementById("suggestion");
        suggestion.style.display = "inline";
        layer.closeAll();
        layer.open({
          type: 1 //Page层类型
          ,skin: 'layui-layer-molv'
          ,area: ['1000px', '800px']
          ,title: ['处理意见','font-size:18px']
          ,shadeClose: true
          ,shade: 0 //遮罩透明度
          ,maxmin: true //允许全屏最小化
          ,content:$("#check")  //弹窗路径
          ,success:function(){
            $.ajax({
              url:"/look?"+'form_code='+obj.data.form_code,
              type: 'get',
              success:function(data){
                // console.log(data);
                let jsonObj = eval('(' + data + ')'); //获得jsonObj对象
                console.log(jsonObj);
                for (let i=0; i < jsonObj.data.length; i++) {
                  $("#used").append("<tr><div class='layui-form-item'><td width='200px'>" + jsonObj.data[i].property_name + "</td><td colspan='5'><input type='text' disabled  placeholder= '' class='layui-input' name='"+jsonObj.data[i].property_en_name+"' value=' " + jsonObj.data[i].detailed_data + "'/></td></div></tr>");

                }
              }
            });
          }

        });
        form.on('submit(handle)', function (data) {
          layer.confirm('确定提交吗？', {
            btn: ['确认', '取消'] //按钮
          }, function () {

            let json = {};
            let newObj = "";

            json.form_code = obj.data.form_code;
            json.reporter_dept = dept_name;

            json.suggestion = form.val("FormLoad").handle_suggestion;

            $.ajax({
              url: '/event/event_handle',
              type: "POST",
              data: json,
              success: function (index) {
                layer.msg("上报成功");
                button.style.display = "none";
                location.reload();
              }
            })

          }, function () {
          });
          console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
          return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });

        $("#used").empty();
      }
    });
    let number = ["无", "无", "无", "无"];
    //选择框监听
    form.on('select(test)', function (data) {
      // number[0] = data.elem[data.elem.selectedIndex].text;
      if (data.value == 0)
        number[0] = "无";
      else
        number[0] = data.value;
      console.log(number[0]);
    });
    form.on('select(test0)', function (data) {
      number[1] = data.elem[data.elem.selectedIndex].text;
      console.log(number[1]);
    });
    // form.on('select(test1)', function (data) {
    //     number[2] = data.elem[data.elem.selectedIndex].text;
    // });
    //查询按钮监听
    form.on('submit(*)', function (data) {
      let i = 0;
      //console.log(data.field.name);
      number[3] = data.field.name;
      // while(number[i]!=null)
      // {
      //     console.log(number[i]);
      //     i++;
      // }
      table.render({
        elem: '#demo'
        ,
        height: 666
        ,
        url: '/Zz/My_event/hander_select?' +'name='+dept_name+'&status='+number[0]+'&kind_name=' + number[1] //数据接口
        ,
        page: true //开启分页
        ,
        cols: [[ //表头
          {title: '序号', fixed: 'left', fixed: 'left', templet: '#index'}
          ,{field: 'reporter_code', title: '提交人' }
          ,{field: 'event_time', title: '提交时间' }
          ,{field: 'kind_name', title: '事件种类'}
          ,{field: 'status_name', title: '事件状态'}
          ,{fixed: 'right', title:'操作', align:'center', toolbar: '#barDemo'}
        ]]
      });
      return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
    });

//  退出登陆事件监听
    //退出登陆事件监听
    $("#exit").on('click',function () {
      //推出弹出层
      var index = layer.confirm('确定退出吗？', {
                btn: ['确认', '取消'] //按钮
              }, function () {
                layer.close(index);
                let url =window.location.origin+window.location.pathname+"#/user/login";
                window.location=url;
              },
              function () {

              });
    });





    //表单重载
    form.render();

  });
</script>
</html>